body,html{
	width: 100%;
	max-width: 750px;
	margin:  0 auto;
}
.zhanwei{
	width: 100%;
	height: 100%;
	background-image: url("../images/page1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.pace-running{
    width: 100%;
    height: 100%;
    background-image: url("../images/page1.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}
.container-a{
	width: 100%;
	height: 100%;
}
.swiper-container{
    visibility: hidden;
}
.swiper-container  .page-zero{
	width: 100%;
	height: 100%;
}
.swiper-container{
	animation: zoomIn .5s ;
}

.swiper-slide{
	overflow: hidden;
}
img{
	max-width: 100%;
}
/*第一页*/
.page-zero,.page-one{
	background-image: url("../images/page1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page1Logo{
	position: absolute;
		left: 0.55rem;
	top: 0.6rem;
}
.page1Logo img{
	width: 2.96rem;
	height: 0.98rem;
}
.page1Bird{
	width: 2.8rem;
	height: 1.25rem;
	position: absolute;
	top:1.3rem;
	left:4.4rem;
}
.page1-head{
	position: absolute;
	top:2.7rem;
	height:1.9rem;
	left: 0;
	width: 100%;
	text-align: center;

}
.page1-head img{
	width: 6.12rem;
}
.page1-head2{
	position: absolute;
	left:0;
	top:5rem;
	width:100%;
	text-align: center;
}
.page1-head2 img{
	width: 3.04rem;

}
.page1-footer{
	position: absolute;
	width: 100%;
	text-align: center;
	left: 0;
	bottom: 0.2rem;
	color: #2d2009;
	font-size: 10px;
}
.page1-footer  span{
	margin-left: 0.3rem;
}
.page1-logo{
	position: absolute;
	right: 0;
	bottom: 0.6rem;
	width: 4.14rem;
	height: 4.14rem;
}
/*page2*/
.page2-bird{
	text-align: right;
	margin-top: 0.05rem;

}
.page2-bird img{
	width: 2.8rem;
	height: 1.25rem;
}

.page2-head1{
	text-align: center;

}
.page2-head1 img{
	width:6.45rem;
	height: 0.8rem;
}

.page2-leader{
	width: 100%;
	text-align: center;
	margin-top: 0.1rem;
}
.page2-leader img{
	width: 6.54rem;
	height: 4.4rem;
}
.page2-border{
	width: 6.4rem;
	height: 4rem;
	margin: 0 auto;
	margin-top: 0.3rem;
	position: relative;
}
.page2-border img{
	width: 6.43rem;
	height: 4rem;
}
.page2-border div{
	position: absolute;
	left: 0.3rem;
	right: 0.3rem;
	top:1rem;
	bottom: 0.3rem;
	font-size: 0.24rem;
	color: #000;
	line-height: 0.4rem;
	text-align: justify;
}

/*page3*/
.page-three{
	background-image: url("../images/page4.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page-three-2{
	background-image: url("../images/page3-2.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}

.page-three-2 .page3-textInto p{
    padding: 0.01rem 0.03rem;
}
.page-three-3{
	background-image: url("../images/page3-3.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page3-photoAlbum{
	width: 5.28rem;
	height: 2.43rem;
	background-image: url("../images/page3-border.png");
	background-repeat: no-repeat;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
	background-size: 5.28rem 2.43rem;
	margin-left: 1.4rem;
	margin-top: 0.3rem;
}
.page-four-1{
	background-image: url("../images/page4-1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page-four-1 .page-other .left .page3-textInto p{
    font-size: 0.26rem !important;
    padding: 0.01rem 0.03rem !important;
}
.page-four-3{
	background-image: url("../images/page-4-3.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page-end{
	background-image: url("../images/page-end.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page3-photoAlbum div{
	position: relative;
	margin-left: 0.14rem;
	margin-top:0.08rem;
	width: 5rem;
	height: 2.25rem;
}
.page3-photoAlbum div img{
	position: absolute;
	left: 0;
	top:0;
	width: 5rem;
	height:2.25rem;
}
.page3-photoAlbum div p{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	font-size: 0.24rem;
	color: #2d2009;
	background: #beab87;
}
.pace-active{

}
.p3-2{
	margin-left: 0.5rem;
	margin-top: 0.1rem;
}
.p3-3{
	margin-left: 1.8rem;
	margin-top: 0.1rem;
}
.page3-text{
	margin-top: 0.2rem;
}

.page3-text .left{
	float: left;
	width: 3.28rem;
	height: 3.08rem;
	margin-left: 0.32rem;
}
.page3-text .left img{
	width: 3.28rem;
	height: 3.08rem;
}
.page3-text .right{
	writing-mode:tb-rl;
	float: right;
	width: 3.3rem;
	margin-right: 0.56rem;
	margin-top: 0.4rem;

}
.page-three-2 .page3-text .right{
	writing-mode:tb-rl;
	float: right;
	width: 3.3rem;
	margin-right: 0.36rem;
	margin-top: 0.6rem;
}

.page3-text  .page3-title{
	font-size: 0.32rem;
	color: #000;
	font-weight: bold;

}
 .page3-title p{
	text-align: justify;
	padding: 0.02rem 0.03rem;
	letter-spacing: 0.1rem;
}
.page3-textInto{
	position: relative;
}
 .page3-textInto p{
	font-size: 0.22rem;
	color: #2d2009;
	text-align: justify;
	line-height:0.36rem;
	padding: 0.01rem 0.04rem ;
}
 .page3-textInto:after{
	/*position: absolute;*/
	/*left: -0.1rem;*/
	/*content:"";*/
	/*bottom: 0;*/
	/*width: 0.19rem;*/
	/*height: 0.19rem;*/
	/*background-image: url("../images/page3-symol.png");*/
	/*background-repeat: no-repeat;*/
	/*background-size: 0.19rem 0.19rem;*/
}
.page3-NoIcon:after{
    position: absolute;
    left: -0.1rem;
    content:"";
    bottom: 0;
    width: 0.19rem;
    height: 0.19rem;
    background-image: url("../images/page3-symol.png");
    background-repeat: no-repeat;
    background-size: 0.19rem 0.19rem;
}
 .page3-textInto .page-icon{
     position: relative;
     display: inline-block;
 }
.page3-textInto .page-icon:after{
    position: absolute;
    left: 0.1rem;
    content:"";
    bottom: -0.3rem;
    width: 0.19rem;
    height: 0.19rem;
    background-image: url("../images/page3-symol.png");
    background-repeat: no-repeat;
    background-size: 0.19rem 0.19rem;
}
.cloudbg{
	position: absolute;
	left: 0;
	top:0;

}
.page5{
	background-image: url("../images/page-5-1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page-5-2{
	background-image: url("../images/page-5-2.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page6{
	background-image: url("../images/page4.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page3-text .cloudbg img{
	width: 100%;

}
.page-style2  .page-other{
	margin-top: 0.2rem;
	overflow: hidden;
}
.page-style2  .page-other .left{
	float: left;
	margin-left: 0.56rem;
	width: 3.36rem;
	writing-mode:tb-rl;
	margin-top: 0.4rem;
}
.page-style2 .page-other .right{
	margin-right: 0.15rem;
	width: 3.1rem;
	height: 3.02rem;
	float: right;

}
.page-style2 .page-other .right img{
    width: 3.1rem;
    height: 3.02rem;
}
.page-style2  .page-other .left .page3-title p{
	text-align: justify;
	padding: 0.02rem 0.03rem;
	letter-spacing: 0.1rem;
}

.page-style2  .page-other .left .page3-textInto{
	position: relative;
}
.page-style2  .page-other .left .page3-textInto p{
	font-size: 0.26rem;
	color: #2d2009;
	text-align: justify;
	line-height:0.36rem;
	padding: 0.01rem 0.04rem ;
}

.page-style2  .page-other .left .page3-title{
	font-size: 0.32rem;
	color: #000;
	font-weight: bold;
}

.page-style2   .p3-1{
	margin-left: 0.5rem;
	margin-top: 0.1rem;
}
.page-style2   .p3-2{
	margin-left: 1.6rem;
}

.page-style2   .p3-3{
	margin-left: 0.5rem;
}
.page6 .video{
	width: 7.5rem;
	height: 3rem;
text-align: center}
.page6 .video video{
	width: 4.3rem;
	height: 2.3rem;
	margin: 0 auto;

}
/*NEXT*/
.next{
	position: absolute;
	left: 0;
	bottom: 0.2rem;
	width: 100%;
	text-align: center;
}
.next img{
	width: 0.76rem;
	height: 0.4rem;
}

.next{
	position: absolute;
	left: 0;
	bottom: 0.2rem;
	width: 100%;
	text-align: center;
	margin: 0 auto;
	-webkit-animation: start 1.5s infinite ease-in-out;
}
@-webkit-keyframes start {
	0%,30% {opacity: 0;-webkit-transform: translate(0,10px);}
	60% {opacity: 1;-webkit-transform: translate(0,0);}
	100% {opacity: 0;-webkit-transform: translate(0,-8px);}
}
@-moz-keyframes start {
	0%,30% {opacity: 0;-moz-transform: translate(0,10px);}
	60% {opacity: 1;-moz-transform: translate(0,0);}
	100% {opacity: 0;-moz-transform: translate(0,-8px);}
}
@keyframes start {
	0%,30% {opacity: 0;transform: translate(0,10px);}
	60% {opacity: 1;transform: translate(0,0);}
	100% {opacity: 0;transform: translate(0,-8px);}
}
.bgm-btn-wraper{
	position: absolute;
	z-index: 200;
	width: 30px;
	height: 30px;
	right: 20px;
	top:10px;

}
.bgm-btn-wraper .bgm-btn{
	background-image: url(../images/music.svg);
	background-size: contain;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
}
.bgm-btn-wraper .bgm-btn.rotate {
	-webkit-animation: rotating 1.2s linear infinite;
	animation: rotating 1.2s linear infinite;


}

.bgm-btn-wraper .bgm-btn {

}

.page-4-text{
	float: right;
	margin-right: 0.56rem;
}
.page-4-text p{
	writing-mode:tb-rl;
	font-size: .22rem;
	color: #2d2009;
	/*letter-spacing: 0.04rem;*/
}
.page-4-demo{
	margin-top: 0.3rem;
	height: 2.2rem;
}
.page-4-pic{
	float: left;
	width: 4.1rem;
	height: 2.15rem;
	position: relative;
	margin-left: 1.06rem;
}
.page-4-demo img{
	width: 4.29rem;
	height: 2.15rem;
	position: relative;

}
.page-4-demo  .page-4-pic p {
	position: absolute;
	left: 1.2rem;
	bottom: -0.12rem;
	width: 3.57rem;
	height:0.22rem ;
	background-image: url("../images/colorBlock.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}
.page-4-text {
	 writing-mode:tb-rl;
}
.page-4-text{
	position: relative;
	padding: 0.13rem 0.17rem 0.13rem 0.12rem;
	margin-top: 0.15rem;
	float: right;
}
.page-4-text:after,
.page-4-text:before{
	position: absolute;
	content: '';
	width:0.17rem;
	height: 0.19rem;
}
.page-4-text:after{
	background-image: url("../images/page4-border1.png");
	background-repeat: no-repeat;
	background-size: cover;
	top:0;
	left:0;

}
.page-4-text:before{
	background-image: url("../images/page4-border2.png");
	background-repeat: no-repeat;
	background-size: cover;
	right: 0;
	bottom: 0;
}
.page-4-demo2{
	margin-left: 0.5rem;
	font-size: 0;
	vertical-align: top;
}

.page-4-demo2 .page-4-text{
	float: none;
	margin-right: 0.1rem;
	display: inline-block;
	vertical-align: top;
}
.page-4-demo2 .page-4-pic{
	float: none;
	margin-left: 0;
	display: inline-block;
	vertical-align: top;
}

.floatCloud{
	position: absolute;
	top:2.6rem;
	left:3.75rem ;
	width:1.96rem ;
	height: 0.68rem;
}
.floatCloud img{
	width:1.96rem ;
	height: 0.68rem;
}
.bigLogo{
	position: absolute;
	left:3.6rem;
	top:0.66rem;
	padding-left: 0.15rem;
	margin-left: 0.15rem;
}
.bigLogo:after{
	position: absolute;
	content: '';
	left: 0;
	top:0;
	width: 1px;
	height: 1.07rem;
	background: #c1ad89;
}
.bigLogo img{
	width: 0.74rem;
	height:0.74rem ;
}
.page-end .video{
	margin: 0 auto;
	margin-top: 2.74rem;
	width: 6.68rem;
	height: 3.77rem;
	background-image: url("../images/videoBg.png");
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;

}
.page-end .video video{
	width: 5.813333rem;
	height: 3.27rem;
	display: block;
	position: absolute;
	left: 0.4rem;
	top:0.2rem;
	border-radius:16px;
	-webkit-border-radius:16px;
	z-index: 9999;
    /*z-index: -1;*/
    /*margin-left: 0.4rem;*/
    /*margin-top: 0.2rem;*/

}
.userCode{
	font-size: 0;
	vertical-align: top;
	padding-top: 0.7rem;
}
.userCode .leftCode
{
	display: inline-block;
	vertical-align: top;
	text-align: center;
	font-size:0.24rem;
	color: #b2812b;
	width: 100%;
}
.userCode .blessing{
    text-align: center;
    margin-bottom: 1rem;
}
.userCode .blessing span{
    position: relative;
    font-size:0.3rem ;
    color: #b2812b;
}
.userCode .blessing span:before{
    position: absolute;
    content: '';
    left: -1.1rem;
    width:0.99rem;
    top:50%;
    height: 1px;
    background: #c1ad89;
}
.userCode .blessing span:after{
    position: absolute;
    content: '';
    right: -1.1rem;
    width:0.99rem;
    top:50%;
    height: 1px;
    background: #c1ad89;
}
.userCode  p{
	padding-top: 0.2rem;
}
.userCode img{
	width: 2.08rem;
	height: 2.08rem;
}

.page-5-2 .page-other .left .page3-textInto p{
    padding: 0.01rem 0.02rem;
    font-size: 0.28rem;
}